<!--{= include ic/admin-header.html }-->

<div class="am-cf admin-main">
  <!--{= include ic/admin-sidebar.html }-->

  <!-- content start -->
  <div class="admin-content">
    <div class="am-cf am-padding">
      <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">文章管理</strong> / <small><!--{ if(result){ }-->编辑文章 - <!--{= result.get("title") }--><!--{ }else{ }-->新建文章<!--{ } }--></small></div>
    </div>
	
	<div class="am-padding-left"><!--{ if(result){ }--><!--{= result.get("title") }--><!--{ }else{ }-->NewArticle<!--{ } }--></div>
    <hr style=" margin-top:0.5rem;" />
	<div class="am-g-fixed am-cf am-padding-left am-padding-bottom">
		<form class="am-form am-u-sm-12 am-form-horizontal am-cf" id="my-form">
			<!--{ if(result){ }-->
				<input id="data-id" type="hidden" value="<!--{= result.id }-->">
			<!--{ } }-->
			<div id="coverBox" class="am-u-sm-4 am-fl">
				<input id="data-cover" type="hidden" <!--{ if(result && result.get("cover")){ }-->value="<!--{= result.get("cover").id }-->"<!--{ } }-->>
				<div class="am-u-sm-12 am-nbfc">
					<img class="am-u-sm-12" id="imgCover" src="<!--{ if(result && result.get("cover") && typeof(result.get("cover"))!="undefined"){ }--><!--{= result.get("cover").get("url") }--><!--{ }else{ }-->/i/default.png<!--{ } }-->" />
				</div>
				<div class="am-u-sm-12 am-cf"></div>
				<div class="am-form-group am-form-file am-u-sm-10 am-u-sm-centered am-padding-top">
					<button type="button" class="am-btn am-btn-danger am-btn-sm am-u-sm-centered" id="btn-uploadCover">
						<i class="am-icon-cloud-upload"></i> 选择要上传的文件</button>
					<input id="doc-form-file" type="file" accept="image/*" >
				</div>
			</div>
			<div class="am-u-sm-8 am-fr">
				<div class="am-form-group">
					<label for="data-title" class="am-u-sm-2 am-form-label">标题</label>
					<div class="am-u-sm-10">
						<input type="text" id="data-title" value="<!--{ if(result){ }--><!--{= result.get("title") }--><!--{ } }-->" placeholder="2-70字符" data-foolish-msg="2-20字符的页面名" minlength="2" maxlength="70" required>
					</div>
				</div>
				
				<div class="am-form-group am-form-inline">
					<label for="data-author" class="am-u-sm-2 am-form-label">作者</label>
					<div class="am-u-sm-3">
						<input type="text" id="data-author" value="<!--{ if(result){ }--><!--{= result.get("author") }--><!--{ }else{ }--><!--{= user.get("username") }--><!--{ } }-->" placeholder="作者"  minlength="2" maxlength="32" required>
					</div>
					<label for="data-contentGroup" class="am-u-sm-2 am-form-label" >文章组</label>
					<div class="am-u-sm-3">
						<select id="data-contentGroup" multiple data-am-selected="{searchBox: 1}">
							<!--{ if(contentGroups.length>0){ }-->
								<!--{ for(var i=0;i<contentGroups.length;i++){ }-->
								<option value="<!--{= contentGroups[i].id}-->" <!--{ if((result && result.get("ContentGroup") instanceof Array && result.get("ContentGroup").indexOf(contentGroups[i].id)!=-1) || (group && group==contentGroups[i].id)){ }-->selected<!--{ } }-->><!--{= contentGroups[i].get("title")}--></option>
								<!--{ } }-->
							<!--{ } }-->
						</select>
					</div>
					<div class="am-u-sm-2"></div>
				</div>
				
				
				<div class="am-form-group">
					<label for="data-keyword" class="am-u-sm-2 am-form-label">关键词</label>
					<div class="am-u-sm-6">
						<input type="text" id="data-keyword" value="<!--{ if(result && result.get("keyword")){ }--><!--{= result.get("keyword").join("|") }--><!--{ } }-->" placeholder="多个关键词间用“|”隔开"  minlength="0" maxlength="100">
					</div>
					<label for="data-sort" class="am-u-sm-2 am-form-label">排序</label>
					<div class="am-u-sm-2">
						<input type="number" id="data-sort" value="<!--{ if(result && result.get("sort")){ }--><!--{= result.get("sort") }--><!--{ }else{ }-->999<!--{ } }-->" placeholder="0-999,数字越小排越前" data-foolish-msg="0-999,数字越小排越前" maxlength="3" max="999" min="0" required>
					</div>
				</div>
				
				<div class="am-form-group">
					<label for="data-keyword" class="am-u-sm-2 am-form-label">摘要</label>
					<div class="am-u-sm-10">
						<textarea id="data-description" placeholder="文章摘要"  rows="2"><!--{ if(result && result.get("description")){ }--><!--{= result.get("description")}--><!--{ } }--></textarea>
					</div>
				</div>
				
				<div class="am-form-group">
					<label for="data-keyword" class="am-u-sm-2 am-form-label">相关</label>
					<div class="am-u-sm-10">
						<input type="text" id="data-linkArticle" value="<!--{ if(result && result.get("linkArticle")){ }--><!--{= result.get("linkArticle").join(",") }--><!--{ } }-->" placeholder="相关文章的ID,多个则用半角的逗号相隔">
					</div>
				</div>
				
				
			</div>
		</form>
		<hr class="am-u-sm-12 am-fl am-cf" />
		<div class="am-u-sm-12 am-fl">
			<link rel="stylesheet" type="text/css" href="/css/simditor.css">
			<link rel="stylesheet" type="text/css" href="/css/simditor-html.css">
			<textarea id="data-content" class="am-pre-scrollable" style="height:40rem;max-height:40rem;"><!--{ if(result && result.get("content")){ }--><!--{= result.get("content") }--><!--{ } }--></textarea>		
		</div>
		<hr class="am-u-sm-12 am-fl am-cf" />
		<div class="am-g am-u-sm-8 am-fl am-cf">
			<div class="am-u-sm-offset-2 am-u-sm-3">
				<div class="am-btn am-btn-default" onclick="history.go(-1)">返回列表</div>
			</div>
			
			<div class="am-u-sm-offset-1 am-u-sm-3 am-u-end">
				<div id="btn-saveEdit" class="am-btn am-btn-primary" onclick="saveEdit(<!--{ if(group){ }-->'<!--{= group }-->'<!--{ } }-->)">确认保存</div>
			</div>
		</div>
		<div class="am-u-sm-12 am-fl am-cf" ></div>
	</div>
  </div>
  <!-- content end -->

</div>

<a class="am-icon-btn am-icon-th-list am-show-sm-only admin-menu" data-am-offcanvas="{target: '#admin-offcanvas'}"></a>

<!--{= include ic/admin-footer.html }-->
<script type="text/javascript" src="/js/simditor/module.js"></script>
<script type="text/javascript" src="/js/simditor/hotkeys.js"></script>
<script type="text/javascript" src="/js/simditor/uploader.js"></script>
<script type="text/javascript" src="/js/simditor/simditor.js"></script>
<script type="text/javascript" src="/js/simditor/beautify-html.js"></script>
<script type="text/javascript" src="/js/simditor/simditor-html.js"></script>

<script type="text/javascript">
var refer	= "list";
var editor, toolbar;
$(function() {
    toolbar = ['title', 'bold', 'italic', 'underline', 'color', '|', 'ol', 'ul', 'blockquote', 'code', 'table', '|', 'link', 'image', 'hr', '|', 'indent', 'outdent', 'alignment', '|', 'html'];
    editor = new Simditor({
      textarea: $('#data-content'),
      placeholder: '这里输入文字...',
      toolbar: toolbar,
      pasteImage: true,
      defaultImage: '/i/default.png',
      upload: {
		url: '/uploadImg',
		fileKey: 'uploadImg',
		connectionCount: 3,
		leaveConfirm: '正在上传图片..'
	  }
    });
});
$(function(){
	$("#collapse-nav").addClass("am-in");
	$("#doc-form-file").on("change",function(e){
		uploadImage(this.files[0]);
	});
})
var validator 	= $('#my-form').validator({submit: function(e) {
	if(this.isFormValid()){
		$.AMUI.progress.start();
		$.post("save", {
			"ajax"			: true,
			"id"			: $('#data-id').val(), 
			"content"		: editor.getValue(), 
			"description"	: $('#data-description').val(), 
			"title"			: $('#data-title').val(), 
			"keyword"		: $('#data-keyword').val(), 
			"sort"			: $('#data-sort').val(), 
			"author"		: $('#data-author').val(), 
			"cover"			: $('#data-cover').val(), 
			"state"			: 2, 
			"contentGroup"	: $('#data-contentGroup').val(),
			"linkArticle"	: $('#data-linkArticle').val()
		},function(data){
			$.AMUI.progress.done();
			$("#btn-saveEdit").removeClass("am-disabled");
			if(typeof(data)=="object" && typeof(data.error)=="undefined"){
				mAlert({
					title:"提示",
					text:"保存成功！",
					onConfirm:function(e) {
						gotoUrl(refer);
					}
				});
			}else{
				console.dir(data);
				mAlert({
					title:"错误",
					text:data.error,
					onConfirm:function(e) {}
				});
			}
		}, "json");
	}else{
		$("#btn-saveEdit").removeClass("am-disabled");
	}
	return false;
}});

function saveEdit(id){
	if(typeof(id)!="undefined" && id.length>16){
		refer="/admin/contentGroup/edit?id="+id;
	}
	$("#btn-saveEdit").addClass("am-disabled");
	validator.submit();
}
</script>